<template>
  <div class="home">
    <mt-swipe :auto="4000">
      <mt-swipe-item v-for="img in list" :key="img.id"><a><img :src="img.img"></a></mt-swipe-item>
    </mt-swipe>
    <div class="mui-content">
        <ul class="mui-table-view mui-grid-view mui-grid-9">
            <router-link to="/news/newslist" class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <span class="mui-icon mui-icon-home"></span>
                <div class="mui-media-body">新闻资讯</div>
            </router-link>
            <router-link to="/photo/photolist" class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <span class="mui-icon mui-icon-email"><span class="mui-badge">5</span></span>
                <div class="mui-media-body">图片分享</div>
            </router-link>
            <router-link to="/products" class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <span class="mui-icon mui-icon-chatbubble"></span>
                <div class="mui-media-body">商品购买</div>
            </router-link>
            <router-link to="/catings" class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <span class="mui-icon mui-icon-location"></span>
                <div class="mui-media-body">留言反馈</div>
            </router-link>
            <router-link to="/video" class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <span class="mui-icon mui-icon-search"></span>
                <div class="mui-media-body">视频专区</div>
            </router-link>
            <router-link to="/link" class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
                <span class="mui-icon mui-icon-phone"></span>
                <div class="mui-media-body">联系我们</div>
            </router-link>
        </ul> 
		</div>

  </div>
</template>

<script>

import axios from 'axios'
import common from '../../kits/common'
export default {
  name: 'home',
  data () {
    return {
      list:[]
    }
  },
  methods: {
   getLunbo(){
     axios.get(common.apidomain+"/api/getlunbo")
     .then( response=>{
       if( response.data.status !=0 ){
         return
       };
      response = response.data 
      this.list = response.message
     })
   }
  },
  created () {
    console.log(123)
    this.getLunbo()
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
  .home {
    width: 100%;
    height: 100%;
    padding-top: 50px
  }
  .mint-swipe {
    width: 100%;
    height: 200px;
  }
  .mint-swipe-item img {
    width: 100%
  }
</style>
